<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="css/botton.css">
    <link rel="stylesheet" href="css/page.css">
    <link rel="stylesheet" href="css/special.css">
    <!-- <link rel="stylesheet" href="css/zoom.css"> -->
    <link rel="stylesheet" href="https://at.alicdn.com/t/font_2105984_85tx9xet5.css">
    <title>pos</title>
</head>
<body>
    <div class="page">
        <div class="left">
            <div class="header-img">
                <img src="images/hongbei.png" alt="">
            </div>
            <div class="wood-img">
                <div>
                    <div>
                        <i class="iconfont iconren"></i><span>黑侠（光谷店）</span>
                    </div>
                    <div>
                        <i class="iconfont iconshijian"></i><span>2016-04-06 10:23 AM</span>
                    </div>
                </div>
            </div>
            <div class="inventory">
                <div class="list">
                    <div class="title"><i class="iconfont iconzhangdan"></i>收支明细</div>
                    <table border rules=rows cellspacing=0>
                        <tr>
                            <th>品名</th>
                            <th>数量</th>
                            <th>金额</th>
                            <th>结算价</th>
                        </tr>
                        <tr>
                            <td>蛋挞</td>
                            <td>5</td>
                            <td>60</td>
                            <td>60&nbsp&nbsp&nbsp</td>
                        </tr>
                        <tr>
                            <td>全麦面包</td>
                            <td>1</td>
                            <td>10.5</td>
                            <td>10.5&nbsp&nbsp&nbsp</td>
                        </tr>
                        <tr>
                            <td>戚风蛋糕</td>
                            <td>1</td>
                            <td>20</td>
                            <td>0&nbsp&nbsp&nbsp</td>
                        </tr>
                        <tr>
                            <td>三明治</td>
                            <td>5</td>
                            <td>60</td>
                            <td>60&nbsp&nbsp&nbsp</td>
                        </tr>
                    </table>
                    <div class="zeng">赠</div>
                </div>
                <div class="total">
                    <p><span>总额：</span><span>￥125.5</span></p>
                    <div class="search-box">
                        <input type="text" value="搜索商品">
                        <div>
                            <i class="iconfont iconshanchuxuanxiang"></i>
                        </div>
                        <div>
                            <i class="iconfont iconsousuo"></i>
                        </div>
                    </div>
                </div>
                <div class="operate">
                    <ul>
                        <li><i class="iconfont iconshanchuxuanxiang"></i></li>
                        <li><i class="iconfont iconjiahao"></i></li>
                        <li><i class="iconfont iconjianhao"></i></li>
                        <li><p class="font">赠</p></li>
                        <li><i class="iconfont iconbi"></i></li>
                        <li><p class="font">挂</p></li>
                        <li><i class="iconfont iconbaoxianxiang"></i></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="right">
            <div class="header-img"></div>
            <div class="book">
                <ul class="label">
                    <li class="label-choosed">戚风蛋糕</li>
                    <li>蛋挞</li>
                    <li>全麦面包</li>
                    <li>戚风蛋糕</li>
                    <li>三明治</li>
                    <li><i class="iconfont iconshangxia"></i></li>
                </ul>
                <div class="book-page">
                    <div class="bearing">

                    </div>
                    <div class="content">
                        <div class="content-page">
                            <ul>
                                <li>
                                    <div>
                                        <p>0001</p>
                                        <p>巧克力蛋糕</p>
                                    </div>
                                    
                                </li>
                                <li class="focused">
                                    <div>
                                        <p>0001</p>
                                        <p>巧克力蛋糕</p>
                                    </div>
                                </li>
                                <li>
                                    <div>
                                        <p>0001</p>
                                        <p>巧克力蛋糕</p>
                                    </div>
                                </li>
                                <li>
                                    <div>
                                        <p>0001</p>
                                        <p>巧克力蛋糕</p>
                                    </div>
                                </li>
                                <li>
                                    <div>
                                        <p>0001</p>
                                        <p>巧克力蛋糕</p>
                                    </div>
                                </li>
                            </ul>
                            <img class="activity" src="images/活动图标.png" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="botton">
            <span class="member">会员信息:</span>
            <div class="botton-menu">
                <ul>
                    <li>
                        <div>
                            <i class="iconfont iconshezhi"></i>
                        </div>
                        <p>管理台</p>
                    </li>
                    <li>
                        <div>
                            <i class="iconfont iconcard"></i>
                        </div>
                        <p>购物卡</p>
                    </li>
                    <li>
                        <div>
                            <i class="iconfont icon7"></i>
                        </div>
                        <p>会员</p>
                    </li>
                    <li>
                        <div>
                            <i class="iconfont iconbiaoqian"></i>
                        </div>
                        <p>促销</p>
                    </li>
                    <li>
                        <div>
                            <i class="iconfont iconalarm_clock"></i>
                        </div>
                        <p>预定</p>
                    </li>
                    <li>
                        <div>
                            <i class="iconfont iconhuanbandan"></i>
                        </div>
                        <p>交班</p>
                    </li>
                    <li>
                        <div>
                            <i class="iconfont iconwodezhangdan"></i>
                        </div>
                        <p>挂单</p>
                    </li>
                </ul>
                <button>
                    <i class="iconfont iconqiandai"></i>
                    <span>收银</span>
                </button>
            </div>
        </div>
    </div>
</body>
</html>